<div id="mod_function_{{each_function.unique_id}}">
  <form id="mod_function_form" method="post" action="/function">
    {{form_conditional.csrf_token}}
    {{form_conditional.function_id(value=each_function.unique_id)}}
    {{form_conditional.function_type(value='conditional')}}

    <div class="row small-gutters" style="padding: 0.3em 0.2em 0.3em 0.3em;">
      <div class="col-auto">
        <button type="button" class="form-control btn btn-primary btn-block" data-dismiss="modal">{{_('Close')}}</button>
      </div>
      <div class="col-auto">
        <input onclick="return $(this).processRequest(this, 'function_mod');" name="function_mod" value="{{_('Save')}}" class="form-control btn btn-primary btn-block" type="button"/>
      </div>
      <div class="col-auto">
        <input onclick="return confirm('{{_('Are you sure you want to delete this?')}}') && $(this).processRequest(this, 'function_delete');" name="function_delete" value="{{_('Delete')}}" class="form-control btn btn-primary btn-block" type="button"/>
      </div>
      <div class="col-auto">
        <input onclick="return $(this).processRequest(this, 'execute_all_actions');" name="execute_all_actions" value="{{_('Execute All Actions')}}" class="form-control btn btn-primary btn-block" type="button"/>
      </div>
      <div class="col-auto my-auto">
        <h5>{{_('Help')}} <a href="https://kizniche.github.io/Mycodo/Functions/#conditional" target="_blank"><span style="font-size: 16px" class="fas fa-question-circle"></span></a></h5>
      </div>
    </div>

    <div class="row small-gutters" style="padding: 0.3em 0.2em 0.3em 0.3em">
      <div class="col-12" style="padding-top: 0.3em">
        Conditional Functions allow the execution of Python 3 code as well as the use of Conditions and Actions within your code to interact with Mycodo. Conditions typically acquire data from Mycodo, such as Input measurements, and Actions typically affect Mycodo, such as actuating an Output or pausing a PID controller. Each Condition and Action you add will have its own description and example code to demonstrate use. See the <a href="https://kizniche.github.io/Mycodo/Functions/#conditional">Conditional Function docs</a> for more information.
      </div>
    </div>

    <div id="status_activated_enable_{{each_function.unique_id}}" class="row small-gutters align-items-end" style="{% if not each_function.is_activated %}display: none; {% endif %}padding: 0.5em 0.2em 0.5em 0.3em">
      <div class="col-12">
        <h5>{{_('Status')}}</h5>
      </div>
      <div class="col-12">
        <span id="function_status_activated_{{each_function.unique_id}}"></span>
      </div>
    </div>

    <div id="return_text_{{each_function.unique_id}}" class="col-12"></div>

    <div class="row small-gutters" style="padding: 0.3em 0.2em 0.3em 0.3em">
      <div class="col-12">
        {{form_conditional.conditional_import.label(class_='control-label')}}
        <div>
          <textarea style="font-family:monospace;" class="form-control" id="conditional_import" name="conditional_import" rows="4" type="text">{{each_function.conditional_import}}</textarea>
        </div>
      </div>
      <div class="col-12">
        {{form_conditional.conditional_initialize.label(class_='control-label')}}
        <div>
          <textarea style="font-family:monospace;" class="form-control" id="conditional_initialize" name="conditional_initialize" rows="4" type="text">{{each_function.conditional_initialize}}</textarea>
        </div>
      </div>
      <div class="col-12">
        {{form_conditional.conditional_statement.label(class_='control-label')}}
        <div>
          <textarea style="font-family:monospace;" class="form-control" id="conditional_statement" name="conditional_statement" rows="12" type="text">{{each_function.conditional_statement}}</textarea>
        </div>
      </div>
      <div class="col-12">
        {{form_conditional.conditional_status.label(class_='control-label')}}
        <div>
          <textarea style="font-family:monospace;" class="form-control" id="conditional_status" name="conditional_status" rows="8" type="text">{{each_function.conditional_status}}</textarea>
        </div>
      </div>
      <div class="col-auto">
        {{form_conditional.name.label(class_='control-label')}}
        <div>
          {{form_conditional.name(class_='form-control', value=each_function.name, **{'title': dict_translation['name']['phrase']})}}
        </div>
      </div>
      <div class="col-auto">
        {{form_conditional.period.label(class_='control-label')}}
        <div>
          {{form_conditional.period(class_='form-control', value=each_function.period, **{'title':_('The duration between executing the Run Python Code')})}}
        </div>
      </div>
      <div class="col-auto">
        {{form_conditional.start_offset.label(class_='control-label')}}
        <div>
          {{form_conditional.start_offset(class_='form-control', value=each_function.start_offset, **{'title':_('The duration to wait before the first operation')})}}
        </div>
      </div>
      <div class="col-auto">
        {{form_conditional.pyro_timeout.label(class_='control-label')}}
        <div>
          {{form_conditional.pyro_timeout(class_='form-control', value=each_function.pyro_timeout, **{'title':_('The timeout for the execution of the Run Python Code')})}}
        </div>
      </div>
      <div class="col-auto">
        {{form_conditional.log_level_debug.label(class_='control-label')}}
        <div class="input-group-text">
          <input id="log_level_debug" name="log_level_debug" type="checkbox" title="{{dict_translation['log_level_debug']['phrase']}}" value="y"{% if each_function.log_level_debug %} checked{% endif %}>
        </div>
      </div>
      <div class="col-auto">
        {{form_conditional.use_pylint.label(class_='control-label')}}
        <div class="input-group-text">
          <input id="use_pylint" name="use_pylint" type="checkbox" title="{{dict_translation['use_pylint']['phrase']}}" value="y"{% if each_function.use_pylint %} checked{% endif %}>
        </div>
      </div>
      <div class="col-auto">
        {{form_conditional.message_include_code.label(class_='control-label')}}
        <div class="input-group-text">
          <input id="message_include_code" name="message_include_code" type="checkbox" title="{{dict_translation['message_include_code']['phrase']}}" value="y"{% if each_function.message_include_code %} checked{% endif %}>
        </div>
      </div>
    </div>

  </form>

  <div class="row align-items-end small-gutters" style="border-top: 1px solid #ddd; padding-top: 0.5em">
    <h5>{{_('Conditions')}} <a href="https://kizniche.github.io/Mycodo/Functions/#conditional-options" target="_blank"><span style="font-size: 16px" class="fas fa-question-circle"></span></a></h5>
  </div>

  <form method="post" action="/function">
    {{form_conditional.csrf_token}}
    {{form_conditional.function_id(value=each_function.unique_id)}}
    {{form_conditional.function_type(value='conditional')}}

    <div class="row align-items-end small-gutters" style="padding: 0.3em 0.2em 0.3em 0.3em">
      <div class="col-auto">
        <select class="selectpicker" data-style="btn btn-primary" data-live-search="true" title="{{_('Condition')}}: {{dict_translation['select_one']['title']}}" id="condition_type_{{each_function.unique_id}}" name="condition_type">
        {% for value, name in conditional_conditions_list %}
          <option value="{{value}}">{{name}}</option>
        {% endfor %}
        </select>
      </div>
      <div class="col-auto">
        <input onclick="return $(this).processRequest(this, 'add_condition');" name="add_condition" value="{{_('Add')}}" class="form-control btn btn-primary btn-sm btn-block" type="button"/>
      </div>
    </div>
  </form>

  <div id="mod_function_conditions_{{each_function.unique_id}}">
  {% for each_condition in conditional_conditions if each_condition.conditional_id == each_function.unique_id %}
    {% include 'pages/function_options/conditional_condition.html' %}
  {% endfor %}
  </div>

  <div class="row align-items-end small-gutters" style="border-top: 1px solid #ddd; padding-top: 0.5em">
    <h5>{{_('Actions')}} <a href="https://kizniche.github.io/Mycodo/Actions" target="_blank"><span style="font-size: 16px" class="fas fa-question-circle"></span></a></h5>
  </div>

  <form method="post" action="/function">
    {{form_actions.csrf_token}}
    {{form_actions.device_id(class_='form-control', value=each_function.unique_id)}}
    {{form_actions.function_type(class_='form-control', value='conditional')}}

    <div class="row align-items-end small-gutters" style="padding: 0.3em 0.2em 0.3em 0.3em">
      <div class="col-auto">
        <select class="selectpicker" data-style="btn btn-primary" data-live-search="true" title="{{_('Action')}}: {{dict_translation['select_one']['title']}}" id="action_type_{{each_function.unique_id}}" name="action_type">
        {% for value, name in choices_actions %}
          <option value="{{value}}">{{name}}</option>
        {% endfor %}
        </select>
      </div>
      <div class="col-auto">
        <input onclick="return $(this).processRequest(this, 'add_action');" name="add_action" value="{{_('Add')}}" class="form-control btn btn-primary btn-sm btn-block" type="button"/>
      </div>
    </div>
  </form>

  {% set post_action = "/function" %}

  <div id="mod_function_actions_{{each_function.unique_id}}">
    <div class="row small-gutters" style="border-bottom: 1px solid #ddd; padding: 0.3em">
      <div class="col-12">
        <strong>Usage</strong>: <strong>self.run_all_actions()</strong> will sequentially execute all the actions below.
      </div>
    </div>
  {% for each_action in action if each_action.function_id == each_function.unique_id %}
    {% include 'pages/actions.html' %}
  {% endfor %}
  </div>

</div>
